<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<link rel="stylesheet" href="./css/style.css" type="text/css">
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript" src="http://jzaefferer.github.com/jquery-validation/jquery.validate.js"></script>
<script language="text/javascript" src="scripts/Calendar.js"></script> 
<link rel="stylesheet" href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.8.3.js"></script>
<script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>

<script>
    $(function() {
        $("#datepicker1").datepicker({
        	minDate: 0,
        	dateFormat:'yy-mm-dd',
        	onSelect: function(dateText, inst){
        	           var the_date = dateText;
        	           $("#datepicker2").datepicker('option', 'minDate', the_date);
        	 }
        }); 
    });
    
    $(function() {
        $("#datepicker2").datepicker({
        	dateFormat:'yy-mm-dd',	
        });
    });
</script>
<script>
    function   SelSubmit1()  
    {  
    document.form.action='/JavaCA/MakeABookingFilter';  
    document.form.submit();
    }  
    function   SelSubmit2()  
    {  
    document.form.action='/JavaCA/MakeABookingProceed';  
    document.form.submit();  
    }  
</script>
<title>Make A New Booking</title>
</head>
<body>
<%@ include file="header.jsp" %>
<table>
<tr>
<td width=15%></td>
<td class="menuborder" width=20%>
<c:if test="${sessionScope.roleUser=='Admin'}">
<table id="head">
			<tr>
<!-- 				<td><h2 id="header">ISS Facilities Booking</h2></td> -->
				<td>
<!-- 				<input type="hidden" name="welcome" id="show_greeting" /> -->
				<c:if test="${!empty sessionScope.LoggedinUser.username}">
				<h5>Welcome ${sessionScope.LoggedinUser.username}</h5>
				</c:if>
				</td>
			</tr>
		</table>
		<table id="content">
			<tr>
				<td><h2 id="header">MENU</h2></td>
			</tr>
			<tr>
				<td><a href="MakeABooking.jsp">Make a Booking</a></td>
			</tr>
			<tr>
				<td><a href="BookDetailsController">View Booking Details</a></td>
			</tr>
			<tr>
				<td><a href="BookingHistoryController">View Booking History</a></td>
			</tr>
			<tr>
				<td><a href="ManageStaff.jsp">Manage Staff</a></td>
			</tr>
			<tr>
				<td><a href="LoadFacility">Manage Facilities</a></td>
			</tr>
			<tr>
				<td><a href="Login.jsp">Sign Out</a>
				</td>
			</tr>
		</table>
</c:if>
<c:if test="${sessionScope.roleUser=='Manager'}">
<table id="head">
			<tr>
			<td>
				<c:if test="${!empty sessionScope.LoggedinUser.username}">
					<h5>Welcome ${sessionScope.LoggedinUser.username}</h5>
				</c:if>
			</td>
			</tr>
		</table>
		<table id="content">
			<tr>
				<td><h2 id="header">MENU</h2></td>
			</tr>
			<tr>
				<td><a href="MakeABooking.jsp">Make a Booking</a></td>
			</tr>
			<tr>
				<td><a href="BookDetailsController">View Booking Details</a></td>
			</tr>
			<tr>
				<td><a href="BookingHistoryController">View Booking History</a></td>
			</tr>
			<tr>
				<td><a href="ReviewController">Review Booking</a></td>
			</tr>
			<tr>
				<td><a href="Login.jsp">Sign Out</a></td>
			</tr>
		</table>
</c:if>
<c:if test="${sessionScope.roleUser=='Staff'}">
		<table id="head">
			<tr>
<!-- 				<td><h2 id="header">ISS Facilities Booking</h2></td> -->
				<c:if test="${!empty sessionScope.LoggedinUser.username}">
					<h5>Welcome ${sessionScope.LoggedinUser.username}</h5>
				</c:if>
			</tr>
			<tr></tr>
		</table>
		<table id="content">
			<tr></tr>
			<tr></tr>
			<tr>
				<td><h2 id="header">MENU</h2></td>
			</tr>
			<tr>
				<td><a href="MakeABooking.jsp">Make a Booking</a></td>
			</tr>
			<tr>
				<td><a href="BookDetailsController">View Booking Details</a></td>
			</tr>
			<tr>
				<td><a href="BookingHistoryController">View Booking History</a></td>
			</tr>
			<tr>
				<td><a href="Login.jsp">Sign out</a></td>
			</tr>
		</table>
</c:if>
</td>
<td width=55%>
<form id="form" name=form method="post">
Facility Type: 
<select id="type" name="type">
  <option value="Auditorium" ${ param['type'] == "Auditorium" ? 'selected="selected"' : '' }> Auditorium</option>
  <option value="MPH" ${ param['type'] == "MPH" ? 'selected="selected"' : '' }>MPH</option>
  <option value="DiscussionRoom" ${ param['type'] == "DiscussionRoom" ? 'selected="selected"' : '' }>DiscussionRoom</option>
  <option value="ClassRoom" ${ param['type'] == "ClassRoom" ? 'selected="selected"' : '' }>ClassRoom</option>
  <option value="MeetingRoom" ${ param['type'] == "MeetingRoom" ? 'selected="selected"' : '' }>MeetingRoom</option>
</select>
<br><br>
FromDate:
 <input type="text" id="datepicker1" name=fromDate value="${fromDate}" />
<br><br>
ToDate:
 <input type="text" id="datepicker2" name =toDate value="${toDate}" />
<br><br>
<input id="retrieve" type="button" value="Retrieve Facilities" onclick="SelSubmit1()">
<br><br>
Reserved Booking: <br>
<table id="BookingRecord" cellspacing="6" cellpadding="2" border="1">
       <tr bgcolor="EBE8E9">
       <th>FacilityName</th>
       <th>FromDate</th>
       <th>ToDate</th>
       <th>Status</th>
       </tr>
     <c:forEach var="bo" items="${bookDetails}">
        <tr>
            <td>${bo.facilityName}</td>
            <td>${bo.fromDate}</td>
            <td>${bo.toDate}</td>
            <td>${bo.status}</td>    
        </tr>
     </c:forEach>
</table>
<br><br>
Available Facilities for your time:  ${fromDate}  To  ${toDate}
<br>
<table cellspacing="6" cellpadding="2" border="1">
       <tr bgcolor="EBE8E9">
       <th>FacilityName</th>
       <th>Type</th>
       <th>Description</th>
       <th>Capacity</th>
       <th>Select</th>
       </tr>
     <c:forEach var="fa" items="${list}">
        <tr>
            <td>${fa.facilityName}</td>
            <td>${fa.type}</td>
            <td>${fa.description}</td>
            <td>${fa.capacity}</td>
            <td><input type="radio" name="facilityName" value="${fa.facilityName}"></td>          
        </tr>
     </c:forEach>
</table>
<br><br>
Priority: 
<select name="priority">
  <option value="3">Low</option>
  <option value="2">Medium</option>
  <option value="1">High</option>
</select>
<br><br>
Reason:<br><textarea name="reason" cols="20" rows="5"></textarea>
<br><br>
Emergency:
<input type="checkbox" name="emergency">
 <br><br>
<input id="book" type="button" value="Proceed" onclick="SelSubmit2()">
</form>
</td>
<td width=10%></td>
</tr>
</table>
<%@ include file="footer.jsp" %>
</body>
</html>

